<template>
	<view class="layout">
		<view class="head">
			共{{queryParams.totalCount}}条数据，已获取{{userList.length}}条
		</view>
		<view class="box" v-for="(item,index) in userList" :key= "item._id">
			<view>序号:{{index+1}}</view>
			<view>i  d:{{item._id}}</view>
			<view>姓名:{{item.name}}</view>
			<view>年龄:{{item.age}}</view>
			<view>性别:{{item.gender}}</view>
			<view>时间:{{item.createTime}}</view>
		</view>
	</view>
</template>

<script setup>
import { ref } from 'vue';
import {onReachBottom} from "@dcloudio/uni-app"
const userList = ref([]);
const db = uniCloud.database();
const queryParams = ref({
	pageNum:1,
	pageSize:5,
	totalCount:0
})
const noData = ref(false);
//增加dbadd

//查询dbget
const getData = async () =>{
	let current = queryParams.value.pageSize*(queryParams.value.pageNum-1)
	let res = await db.collection("demo-user")
	.field('name,age,gender,createTime')
	.orderBy('age asc ,createTime desc')
	.skip(current)
	.limit(queryParams.value.pageSize)
	.get({
		getCount:true,
		//getOne:true
	});
	console.log(res);
	userList.value = [...userList.value,...res.result.data];
	queryParams.value.totalCount = res.result.count
	if(queryParams.value.pageSize > res.result.data.length){
		noData.value = true
	}
}

onReachBottom(()=>{
	if(noData.value){
		return;
	}
	console.log("触底了");
	queryParams.value.pageNum++;
	getData();
})
getData();
</script>

<style lang="scss" scoped>
.layout{
	.head{
		text-align: center;
		padding: 10rpx 0;
		font-size: 26rpx;
		color: #888;
	}
	.box{
		padding: 15rpx 30rpx;
		border-bottom: 1px solid #eee;
	}
}
</style>
